<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="lib/html5shiv.js"></script>
    <script type="text/javascript" src="lib/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css"/>
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css"/>
    <link rel="stylesheet" href="static/vant/index.css">
    <!--[if IE 6]>
    <script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js"></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <title>Title</title>
</head>
<body>
<article class="page-container" id="app">
    <table style="table-layout:fixed; width: 100%; word-break:break-all;" class="table table-border table-bordered table-bg table-hover table-sort table-responsive" id="tablelist">
        <tbody id="datalist">
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">流水号</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0; color:#d7d7d7" ref="VALUE01" readonly="readonly" id="VALUE01">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">名称</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE02" id="VALUE02" autocomplete="off">
            </td>
        </tr>
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">食堂消费率</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE04" id="VALUE04" autocomplete="off">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">超市消费率</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE05" id="VALUE05" autocomplete="off">
            </td>
        </tr>
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">有效时长(月)</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE03" id="VALUE03" autocomplete="off">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">管理类型</td>
            <td style="font-size: 0.8rem;">
                <div style="text-align: left">
                    <label class="single"><input type="radio" ID="VALUE06工本费" name="gllx" value="工本费" style="margin: 8px; padding: 5px"/>工本费</label>
                    <label class="single"><input type="radio" ID="VALUE06卡押金" name="gllx" value="卡押金" style="margin: 8px; padding: 5px"/>卡押金</label>
                </div>
            </td>
        </tr>
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">押金/工本费）金额</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE07" id="VALUE07" autocomplete="off">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">个人最大允许持卡张数</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE08" id="VALUE08" autocomplete="off">
            </td>
        </tr>
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">月限额</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE09" id="VALUE09" autocomplete="off">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">限额策略</td>
            <td style="font-size: 0.8rem;">
                <div style="text-align: left">
                    <label class="single"><input type="radio" ID="VALUE10按月" name="xecl" value="按月" style="margin: 8px; padding: 5px"/>按月</label>
                    <label class="single"><input type="radio" ID="VALUE10按年" name="xecl" value="按年" style="margin: 8px; padding: 5px"/>按年</label>
                </div>
            </td>
        </tr>
        <tr class="text-c" v-show="flag">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">操作员号</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE11" id="VALUE11" autocomplete="off">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">其他</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" ref="VALUE12" id="VALUE12" autocomplete="off">
            </td>
        </tr>
        </tbody>
    </table>
    <van-row style="margin-top: 25px;">
        <van-col span="6"></van-col>
        <van-col span="6"></van-col>
        <van-col span="6">
            <div style="text-align: right">
                <van-button type="primary" @click="fDo()" style="width: 80%">提交</van-button>
            </div>
        </van-col>
        <van-col span="6">
            <div style="text-align: right">
                <van-button type="info" @click="fExit()" style="width: 80%">返回</van-button>
            </div>
        </van-col>
    </van-row>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript" src="static/axios.min.js"></script>
<script type="text/javascript" src="./static/vue"></script>
<script src="static/vant/vant.min.js"></script>
<script type="text/javascript">

    let vm = new Vue({
        el: '#app',
        data: {
            flag: false,
            lock: false
        },
        methods: {
            fDo() {
                if (!this.lock) {
                    this.lock=true
                    let self = this
                    let params = new URLSearchParams();
                    params.append('CMD', "AC");
                    params.append('VALUE01', this.$refs.VALUE01.value);
                    params.append('VALUE02', this.$refs.VALUE02.value);
                    params.append('VALUE03', this.$refs.VALUE03.value);
                    params.append('VALUE04', this.$refs.VALUE04.value);
                    params.append('VALUE05', this.$refs.VALUE05.value);
                    params.append('VALUE06', $("input[name='gllx']:checked").val());
                    params.append('VALUE07', this.$refs.VALUE07.value);
                    params.append('VALUE08', this.$refs.VALUE08.value);
                    params.append('VALUE09', this.$refs.VALUE09.value);
                    params.append('VALUE10', $("input[name='xecl']:checked").val());
                    params.append('VALUE11', this.$refs.VALUE11.value);

                    axios.post('/f_wscl/com2', params)
                        .then(function (res) {
                            let {db1} = res.data
                            if (db1[0].VALUE01 === 'ZZ01') {
                                layer.msg(db1[0].VALUE02, {icon: 0, time: 2000});
                            } else if (db1[0].VALUE01 === 'ZZ00') {
                                layer.msg('数据库操作完毕!', {icon: 1, time: 900}, function () {
                                    let index = parent.layer.getFrameIndex(window.name);
                                    parent.fInit();
                                    parent.layer.close(index);
                                });
                            }
                        })
                        .catch(function (error) {
                            layer.msg('网络异常错误', {icon: 1, time: 1000});
                        }).finally(function (){
                            self.lock=false
                    });
                }
            },

            fExit() {
                let index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            }
        },

        created() {

            // this.infoData = parent.layer.methodConfig.data;
            console.log(parent);
        }
    })

    $(document).ajaxComplete(function (event, xhr, settings) {
        //从http头信息取出 在filter定义的sessionstatus，判断是否是 timeout
        if (xhr.getResponseHeader("sessionstatus") === "timeout") {
            //从http头信息取出登录的url ＝ loginPath
            if (xhr.getResponseHeader("loginPath")) {
                window.location.replace(xhr.getResponseHeader("loginPath"));
            }
        }
    });

    <%--$(function()--%>
    <%--{--%>
    <%--    var self = this;--%>

    <%--    $("#form-admin-add").validate({--%>
    <%--        onkeyup:false,--%>
    <%--        focusCleanup:true,--%>
    <%--        success:"valid",--%>
    <%--        submitHandler:function(form){--%>
    <%--            var LS_VALUE01    = $("#VALUE01").val()||'';--%>
    <%--            var LS_VALUE02    = $("#VALUE02").val()||'';--%>
    <%--            var LS_VALUE03    = $("#VALUE03").val()||'';--%>
    <%--            var LS_VALUE04    = $("#VALUE04").val()||'';--%>
    <%--            var LS_VALUE05    = $("#VALUE05").val()||'';--%>
    <%--            var ls_opid = "${sessionOpid}";--%>

    <%--            if (LS_VALUE02.length === 0)--%>
    <%--            {--%>
    <%--                layer.msg("请输入负责人姓名", {icon: 2, time: 1500});--%>
    <%--                return;--%>
    <%--            }--%>

    <%--            if (LS_VALUE03.length === 0)--%>
    <%--            {--%>
    <%--                layer.msg("请输入部门名称", {icon: 2, time: 1500});--%>
    <%--                return;--%>
    <%--            }--%>

    <%--            //$(form).ajaxSubmit({              //该种方法提交是讲表单进行提交，后台将按照name的符号去获取值--%>
    <%--            $.ajax({                            //该方法提交，在前端获取控件的值去进行提交， 两种方法就是前段和后端的区别--%>
    <%--                type: 'post',--%>
    <%--                url: "com",--%>
    <%--                data: {URL:'',--%>
    <%--                    CMD:'ZE',--%>
    <%--                    VALUE01:LS_VALUE01,--%>
    <%--                    VALUE02:LS_VALUE02,--%>
    <%--                    VALUE03:LS_VALUE03,--%>
    <%--                    VALUE04:LS_VALUE04,--%>
    <%--                    VALUE05:LS_VALUE05,--%>
    <%--                    VALUE06:ls_opid},--%>
    <%--                async:false,--%>
    <%--                success: function(data){--%>
    <%--                    var jsonobj = JSON.parse(data);--%>
    <%--                    var json1 = jsonobj.db1;--%>
    <%--                    if (json1[0].VALUE01.toString() === 'ZZ00')--%>
    <%--                    {--%>
    <%--                        layer.msg('数据库操作完毕!', {icon: 1, time: 1500}, function () {--%>
    <%--                            var index = parent.layer.getFrameIndex(window.name);--%>
    <%--                            parent.f_getinfo();--%>
    <%--                            parent.layer.close(index);--%>
    <%--                        });--%>
    <%--                    }--%>
    <%--                    else {--%>
    <%--                        layer.msg(json1[0].VALUE02.toString(), {icon: 2, time: 2000});--%>
    <%--                    }--%>
    <%--                },--%>
    <%--                error: function(XmlHttpRequest, textStatus, errorThrown){--%>
    <%--                    layer.msg('网络异常错误',{icon:1,time:1000});--%>
    <%--                }--%>
    <%--            });--%>
    <%--        }--%>
    <%--    });--%>
    <%--});--%>
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
